<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
<form id="ff" enctype="multipart/form-data" method="post">
    <input id="file" type="file" name="file"  multiple="multiple"/><br/>
    <input type="button" value="插件异步上传" onclick="upload()"/>
</form>

<script type="text/javascript" src="http://code.jquery.com/jquery-2.0.1.min.js"></script>
<script type="text/javascript" src="https://cdn.bootcss.com/jquery.form/4.2.2/jquery.form.min.js"></script>

<script>
    function upload(){
        if($('#file').val() === ""){
            alert('你没有选中文件!');
            return ;
        }
        var options = {
            type: "post",
            url : "img/uploadImage",
            dataType: "text",
            success : function(data) {
                //返回data为json字符串，转化为json对象
                var obj = eval('('+ data +')');
                //判断状态
                if (obj.code === 0) {//状态为成功
                    //obj.data为返回图片外链
                    $("#ff").append('<img width="400" src="'+obj.data+'"/>');
                }else{//上传失败 obj.msg为失败信息
                    alert(obj.msg);
                }
            }
        };
        //jquery-form用插件异步提交
    }
</script>

</body>
</html>
